
<template>
<div class="container">
    <div class="form-group">
      <label for="userName">用户名</label>
      <input type="text" class="form-control" v-model="userName">
    </div>
    <div class="form-group">
      <label for="password">Password</label>
      <input type="password" class="form-control" v-model="password">
    </div>
    <button id="sub" type="button" @click="login" class="btn btn-primary">Submit</button>
    <button id="cancel" type="button" @click="cancel" class="btn btn-default">Cancel</button>
    <button id="sub" type="button" @click="reg" class="btn btn-primary">Register</button>
</div>
</template>

<script>
import Swal from 'sweetalert'
import {post} from '../utils/utils.js'
export default {
  data:function () {
    return {
      userName: '',
      password: ''
    }
  },
  methods:{
    async login (){
      if(!this.userName){
        Swal('', '请输入用户名', 'error')
        return 
      }
      if(!this.password){
        Swal('', '请输入密码', 'error')
        return 
      }
      const res = await post('/users/login', {userName:this.userName, password:this.password})
      if(res.err==1){
        Swal('', res.msg, 'error')
        return 
      }
      this.jump('comp-main')
    },
    cancel(){
      this.jump('comp-main')
    },
    reg(){
      this.jump('comp-reg')
    },
    jump(compName, data){
      this.$root.chgComp(compName, data)
    }
  }

}
</script>
